<template>
    <div>
      <Card class="clearfix" style="padding-bottom: 16px">
        <p slot="title">
          功能列表
        </p>
        <Form label-position="left" :label-width="72">
          <Row :gutter="15">
            <i-col span="6">
              <FormItem label="功能标题：">
                <Input v-model="searchvalue" clearable placeholder="请输入功能标题"/>
              </FormItem>
            </i-col>
            <i-col span="6">
              <Button type="success" @click="searchData" icon="ios-search" >搜索</Button>
            </i-col>
          </Row>
        </Form>
        <Row class="margin-top-10 publish-button-con">
              <Button  @click="addData" icon="ios-checkmark" style="width:90px;" type="primary">新增</Button>
        </Row>
        <br>
        <div>
            <list-table refs="table1" v-model="tableData" :table-data="tableData"></list-table>
        </div>
        <Page ref="pages" :total="itemTotal" show-total style="float: right; margin-top: 20px" @on-change="getList"></Page>
      </Card>
    </div>
</template>

<script>
import listTable from './components/listTable.vue'
import ajax from '../../../libs/axios.js'
export default {
    name: 'setfunctionindex',
    components: {
        listTable
    },
    data () {
        return {
            searchvalue: '',        // 功能标题
            itemTotal: 0,           // table条数
            tableData: [],          // table数据集
        }
    },
    mounted () {
        this.init()
    },
    activated () {
        this.init()
    },
    methods: {
        // 初始化数据
        init () {
          this.$store.commit('setActiveName', 'setfunctionindex');
          this.getList('1')
        },
        // 搜索按钮
        searchData () {
            this.getList('1')
        },
        // 新增按钮
        addData () {
            this.$router.push({
                name: 'addfunction',
                params: {
                  id: 'add'
                }
            })
        },
        // table列表数据
        getList (page) {
            let url = 'adminlogin/function/selectCjFunction'
            let data = {
                funcname: this.searchvalue,
                pageSize: 10,
                pageNum: page
            }
            ajax.formRes(url, data).then(res => {
              this.itemTotal = res.count
              this.tableData = res.data
            }).catch(res => {
              console.log('有错误信息')
            })
        }
    }
}
</script>

<style lang="less">
    @import "../../../styles/common.less";
    @import "../../../styles/table.less";
</style>
